﻿@page "/GridGrouping"
@layout DataProviderAccessArea<INwindDataProvider>

<DemoPageSectionComponent Id="DataGrid-Grouping" ShowHorizontalScrollBar="true">
    @inject NwindDataService NwindDataService

    @if(Data == null) {
        <p><em>Loading...</em></p>
    } else {
        <DxDataGrid Data="@Data" ShowPager="true" ShowGroupPanel="true">
            <DxDataGridColumn Field="@nameof(Customer.ContactName)" />
            <DxDataGridColumn Field="@nameof(Customer.CompanyName)" />
            <DxDataGridColumn Field="@nameof(Customer.City)" Width="200px" />
            <DxDataGridColumn Field="@nameof(Customer.Region)" Width="120px" />
            <DxDataGridColumn Field="@nameof(Customer.Country)" GroupIndex="0" Width="200px" />
        </DxDataGrid>
    }

    @code {
        IEnumerable<Customer> Data;

        protected override async Task OnInitializedAsync() {
            Data = await NwindDataService.GetCustomersAsync();
        }
    }
</DemoPageSectionComponent>
